<template>
  <view class="container">
    <!-- 电瓶车估价模块 -->
    <view class="section">
      <view class="section-title">电瓶车估价</view>
      <view class="form">
        <picker mode="selector" :range="brands" @change="bindBrandChange">
          <view class="form-item">
            <text>品牌：</text>
            <text class="value">{{selectedBrand}}</text>
            <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
          </view>
        </picker>
        <picker mode="selector" :range="years" @change="bindYearChange">
          <view class="form-item">
            <text>车龄：</text>
            <text class="value">{{selectedYear}}年</text>
            <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
          </view>
        </picker>
        <picker mode="selector" :range="currents" @change="bindCurrentChange">
          <view class="form-item">
            <text>电池电流：</text>
            <text class="value">{{selectedCurrent}}A</text>
            <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
          </view>
        </picker>
        <picker mode="selector" :range="voltages" @change="bindVoltageChange">
          <view class="form-item">
            <text>电池电压：</text>
            <text class="value">{{selectedVoltage}}V</text>
            <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
          </view>
        </picker>
        <button class="primary-btn" @click="estimatePrice">立即估价</button>
      </view>
      <!-- 估价结果 -->
      <view v-if="estimatedPrice" class="result-section">
        <view class="result-card">
          <text class="result-title">估价结果</text>
          <text class="result-price">¥{{estimatedPrice}}</text>
          <text class="result-tip">仅供参考，实际价格以线下评估为准</text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import electricVehicleConstants from '@/utils/electric-vehicle-constants.json'

export default {
  data () {
    return {
      ...electricVehicleConstants
    }
  },
  methods: {
    bindBrandChange(e) {
      this.selectedBrand = this.brands[e.detail.value]
    },
    bindYearChange(e) {
      this.selectedYear = this.years[e.detail.value]
    },
    bindCurrentChange(e) {
      this.selectedCurrent = this.currents[e.detail.value]
    },
    bindVoltageChange(e) {
      this.selectedVoltage = this.voltages[e.detail.value]
    },
    estimatePrice() {
      // 简单估价逻辑示例
      const basePrice = 1000
      const brandFactor = this.brands.indexOf(this.selectedBrand) * 200
      const yearFactor = (5 - this.selectedYear) * 100
      const currentFactor = this.selectedCurrent * 10
      const voltageFactor = this.selectedVoltage * 5

      this.estimatedPrice = basePrice + brandFactor + yearFactor + currentFactor + voltageFactor

      uni.showToast({
        title: '估价成功',
        icon: 'success'
      })
    }
  }
}
</script>

<style lang="scss">
@use './valuation.scss';
</style>
